<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>个人信息</title>
  <link rel="stylesheet" href="../static2/bootstrap-3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="../static2/css/layout.css">
  <link rel="stylesheet" href="../static2/css/index.css">
  <link rel="stylesheet" type="text/css" href="../static2/css/person.css">
  <!--  <link rel="stylesheet" type="text/css" href="../static2/css/publish.css"> -->
  <script src="../static2/js/jquery-3.4.1.min.js"></script>
  <script src="../static2/bootstrap-3.3.7/js/bootstrap.min.js"></script>
  <script src="../static2/echarts-2.2.7/echarts-all.js"></script>
  <script type="text/javascript" src="../static2/js/publish.js"></script>
  <script type="text/javascript" src="../static2/js/wangEditor.js"></script>
  <script type="text/javascript" src="../static2/js/main.js"></script>
  <link rel="stylesheet" href="../static2/css/reset.css">
  <link rel="stylesheet" href="../static2/css/style.css">
  <script type="text/javascript">
    $(function () {
      $("#portrait").on("change", function () {
        $("#filenameImg").jsp(this.files[0].name);
        var imgFile = this.files[0];
        var fr = new FileReader();
        fr.onload = function () {
          document.getElementById('portraitImage').src = fr.result;
        };
        fr.readAsDataURL(imgFile);
      });
    });
  </script>
</head>

<body>
  <!-- 外部容器 -->
  <div class="container-layout">
    <div class="top_bar"></div>
    <div class="wrap">
      <!-- 左侧导航 -->
      <div class="nav_left">
        <!-- 标题 -->
        <div class="title">
          <span class="glyphicon glyphicon-folder-open" aria-hidden="true"></span>看点资讯
        </div>
        <!-- 列表 -->
        <!--  <ul class="nav_list">
          <li class="current">
            <span class="glyphicon glyphicon-asterisk" aria-hidden="true"></span>
            <a href="./index.jsp">首页</a>
            <span class="glyphicon glyphicon-chevron-right"></span>
          </li>
          <li>
            <span class="glyphicon glyphicon-tasks" aria-hidden="true"></span>
            <a href="./category.jsp">栏目管理</a>
            <span class="glyphicon glyphicon-chevron-right"></span>
          </li>
          <li>
            <span class="glyphicon glyphicon-send" aria-hidden="true"></span>
            <a href="./message.jsp">资讯管理</a>
            <span class="glyphicon glyphicon-chevron-right"></span>
          </li>
          <li>
            <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
            <a href="./user.jsp">用户管理</a>
            <span class="glyphicon glyphicon-chevron-right"></span>
          </li>
        </ul> -->
        <div class="showLeft">
          <ul class="cd-accordion-menu animated">
            <li class="has-children">
              <input type="checkbox" name="group-1" id="group-1" checked>
              <label for="group-1">首页</label>

              <ul>
                <li><a href="../index.jsp">首页展示</a></li>
              </ul>
            </li>

            <li class="has-children">
              <input type="checkbox" name="group-4" id="group-4">
              <label for="group-4">资讯栏目</label>

              <ul>
                <li class="has-children">
                  <input type="checkbox" name="sub-group-3" id="sub-group-3">
                  <label for="sub-group-3">栏目一级</label>

                  <ul>
                    <li><a href="./show.jsp">栏目二级</a></li>
                    <li><a href="#0">栏目二级</a></li>
                  </ul>
                </li>
                <li><a href="#0">新栏目一级</a></li>
                <li><a href="#0">旧栏目二级</a></li>
              </ul>
            </li>

            <li class="has-children">
              <input type="checkbox" name="group-3" id="group-3" checked>
              <label for="group-3">个人管理</label>

              <ul>
                <li><a href="./publish.jsp">我的发布</a></li>
                <li><a href="./history.jsp">浏览记录</a></li>
                <li><a href="./click.jsp">我的点赞</a></li>
                <li><a href="./collection.jsp">我的收藏</a></li>
                <li><a href="./report.jsp">我的举报</a></li>
                <li><a href="./person.jsp">个人信息</a></li>
              </ul>
            </li>


          </ul>
        </div>
      </div>
      <!-- 右侧内容 -->
      <div class="content_right">
        <div class="top_bar">
          <!-- 用户信息 -->
          <div class="user_info">
            <img src="../static2/images/tx.jpg" alt="">
            <span>胡六</span>
          </div>
          <div class="login">
            <a href="./login.jsp">退出</a>
          </div>
        </div>
        <!-- 内容 -->
        <div class="content">
          <div class="search_bar">

            <span class="search_title">个人信息</span>&nbsp;&nbsp;

          </div>
          <!-- 搜索end -->
          <div class="news_list">
            <div class="login_container">
              <div class="login_content">

                <div class="signin">
                  <form>
                    <div class="form-group">
                      <label for="signinInputName">账号: </label>
                      <input type="text" class="form-control person_input" id="signinInputName" placeholder="请输入账号">
                    </div>
                    <div class="form-group">
                      <label for="signinInputPassword">密码: </label>
                      <input type="text" class="form-control person_input" id="signinInputPassword" placeholder="请输入密码">
                    </div>
                    <div class="form-group">
                      <label for="signinInputPassword ">确认密码: </label>
                      <input type="text" class="form-control person_input" id="signinInputPassword" placeholder="请输入密码">
                    </div>
                    <div class="form-group">
                      <div class="imgContainer">
                        <div class="file-container"
                          style="display:inline-block;position:relative;overflow: hidden;vertical-align:middle">
                          <button class="btn btn-success fileinput-button" id="upBtn" type="button">上传头像</button>
                          <input name="picfile" type="file" id="portrait"
                            style="position:absolute;top:0;left:0;font-size:34px; opacity:0" accept=".png,.jpeg,.jpg">
                        </div>
                        <span id="filenameImg" style="vertical-align: middle">未上传文件</span>
                        <div class="radius_img"><img id="portraitImage" src="../static2/images/2.jpg"></div>
                      </div>

                    </div>
                    <div class="Access"><a href="index.jsp">确定</a></div>
                  </form>
                </div>
              </div>


            </div>

          </div>

        </div>
        <!-- 内容 -->

      </div>
    </div>
  </div>

  <script type="text/javascript" src="../static2/js/basic.js"></script>
</body>

</html>